<%--
  Created by IntelliJ IDEA.
  User: lijin
  Date: 2019/12/9
  Time: 22:50
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>咕咕咕借贷平台</title>
</head>
<link rel="stylesheet" href="layui/css/layui.css" media="all">
<body>
<ul class="layui-nav">
    <li class="layui-nav-item"><a href="">首页</a></li>
    <li class="layui-nav-item ">
        <a href="javascript:;">我的账户</a>
        <dl class="layui-nav-child">
            <dd><a href="">实名认证</a></dd>
            <dd><a href="">风控材料认证</a></dd>
            <dd><a href="">银行卡管理</a></dd>
            <dd><a href="">登录记录</a></dd>
            <dd><a href="">个人资料</a></dd>
        </dl>
    </li>
    <li class="layui-nav-item"><a href="">账户充值</a></li>

    <li class="layui-nav-item">
        <a href="javascript:;">资明细查询</a>
        <dl class="layui-nav-child">
            <dd><a href="">还款明细</a></dd>
            <dd><a href="">充值明细</a></dd>
            <dd><a href="">提现申请</a></dd>

        </dl>
    </li>
    <li class="layui-nav-item layui-this" lay-unselect="">
        <a href="javascript:;"><img src="//t.cn/RCzsdCq" class="layui-nav-img">本账号</a>
        <dl class="layui-nav-child">
            <dd><a href="javascript:;">修改信息</a></dd>
            <dd><a href="javascript:;">安全管理</a></dd>
            <dd><a href="javascript:;">注销</a></dd>
        </dl>
    </li>
    <li class="layui-nav-item"><a href="">帮助</a></li>
</ul>

<blockquote class="layui-elem-quote layui-quote-nm">
    用户名：
    最后登录时间:

    <hr class="layui-bg-cyan">
    账户总额： &nbsp;&nbsp;&nbsp;&nbsp; 可用金额：&nbsp;&nbsp;&nbsp;&nbsp; 冻结金额：<br />
    待收利息： &nbsp;&nbsp;&nbsp;&nbsp; 待收本金：&nbsp;&nbsp;&nbsp;&nbsp; 待还本息：
    <hr class="layui-bg-red">

    <div class="site-demo-button" id="layerDemo" style="margin-bottom: 0;">
        <img src="img/shiming.png"> 实名认证：<a style="color: red; cursor: pointer;" >点击认证</a>
        &nbsp;&nbsp;&nbsp;&nbsp;<img src="img/shouji.jpg">手机认证:<a>点击认证</a>&nbsp;&nbsp;&nbsp;&nbsp;
        <img src="img/youxiang.jpg" />邮箱认证：<a>点击认证</a>

    </div>

</blockquote>



<script src="layui/layui.js" charset="utf-8"></script>

<script>
    layui.use(['form', 'layedit', 'laydate'], function() {
        var form = layui.form,
            layer = layui.layer,
            layedit = layui.layedit,
            laydate = layui.laydate;
        form.render();
        //日期
        laydate.render({
            elem: '#date'
        });
        laydate.render({
            elem: '#date1'
        });

        //创建一个编辑器
        var editIndex = layedit.build('LAY_demo_editor');

        //自定义验证规则
        form.verify({
            title: function(value) {
                if (value.length < 2) {
                    return '姓名格式错误';
                }
            },
            content: function(value) {
                layedit.sync(editIndex);
            }
        });



        //监听提交
        form.on('submit(demo1)', function(data) {
            layer.alert(JSON.stringify(data.field), {
                title: '最终的提交信息'
            })
            return false;
        });

        //表单取值
        layui.$('#LAY-component-form-getval').on('click', function() {
            var data = form.val('example');
            alert(JSON.stringify(data));
        });

    });
</script>

<script>
    layui.use('element', function() {
        var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块

        //监听导航点击
        element.on('nav(demo)', function(elem) {
            //console.log(elem)
            layer.msg(elem.text());
        });
    });
</script>


</body>

</html>

